<template>
	<div id="" class="pt10">
		<!-- 搜索是通过搜小区名称来的 -->
		<search-box class="houselist-search"
		:communityName="communityName"
		@click.native="toSearch"></search-box>
		<section class="tabSection">
			<tab class="tab" :tabMain="tabMain" @setTabidx='setTabidx'></tab>
			<span @click="filter">
				<img src="@/assets/images/filter@2x.png" alt="" width="20">
			</span>

			<div class="tabSpiece" style="height:100%; overflow:hidden;" v-show="showTab">
				<area-list v-show="popupArea" @click="showTabCK(0)" @areaEvent="areaEvent" class="tabChild"></area-list>
				<rent-price v-show="popupRent" @click="showTabCK(1)" @rentPriceEvnet="rentPriceEvnet" class="tabChild"></rent-price>
				<filter-choose v-show="popupFilter" @click="showTabCK(5)" @filterEvent="filterEvent" class="tabChild"></filter-choose>
				<span class="shadow" v-show="showTab" @click="hiddenTab"></span>
			</div>

			<!-- 户型 -->
			<mt-popup
			  v-model="popupHousetype"
			  position="bottom" style="width:100%;">
				<house-type @houseTypeEvent="houseTypeEvent"></house-type>
			</mt-popup>

			<!-- 更多 -->
			<mt-popup
			  v-model="popupMore"
			  position="right" style="height:100%;">
			  <more-filter @moreFilterEvent='moreFilterEvent'></more-filter>
			</mt-popup>
		</section>
    <!--滑动区域-->
		<div id="mescroll" class="mescroll" style="position:fixed; top:100px; bottom:60px; height:auto;">
			<!--展示上拉加载的数据列表-->
      <ul id="dataList">
        <li v-for="items in houseList" :key="items.key" class="houseSection">
          <house :houseInfo="items"></house>
        </li>
      </ul>
    </div>
<foot-nav></foot-nav>
	</div>
</template>

<script src="./searchHouse.js"></script>

<style scoped lang="scss" src="@/pages/houseList/houseList.scss"></style>
